<template>
  <view>
    <view class="xy-modal-box xy-modal-box-center refund-box" :class="[refundModelShow?'xy-modal-show':'']">
      <view class="refund-tite">
        <text>您有上课申请被拒绝了</text>
        <text class="yz-iconfont yz-guanbi" @tap="close_buy()"></text>
      </view>
      <view class="refund-content" v-if="refundOrder">
        <!--        <view>试课券已原路返回至您的账户</view>-->
        拒绝原因：{{refundOrder.refund_reason}}
      </view>

      <view class="refund-action">
        <view class="yes" @tap="continue_buy">继续下单该老师</view>
        <view class="no" @tap="reset_buy">重新选择老师</view>
      </view>
    </view>
    <view class="xy-modal-mask" :class="[refundModelShow?'xy-mask-show':'']" @tap="refundModelShow =!refundModelShow"></view>
  </view>
</template>
<script>
import { mapState } from 'vuex';
export default {
  name: "notice",
  props: {

  },
  data() {
    return {
      refundModelShow: false,
      refundOrder: '',
      refund_type :''
    }
  },
  computed: {
    ...mapState(['user'])
  },
  created() {
    this.loadNotice();
  },
  methods:{
    loadNotice(){
      var that = this;
      this.$api.get({
        url : '/user/refund_unread',
        success: res => {
          if(res.refund_order){
            that.refundOrder = res.refund_order;
            that.refundModelShow = true;
          }
          if(res.refund_audit>0){
            uni.showModal({
              title: '提示',
              content: '您之前提交入驻审核被驳回了',
              confirmText: '查看原因',
              showCancel: true,
              success: function (res) {
                if(res.confirm){
                  that.$xyfun.to('/pages/teacher/refund_reson')
                }
              }
            });

          }
        }
      })
    },

    //关闭弹窗
    close_buy(){
      this.$api.postBase({
        url: 'teacher/refund_read',
        data: {
          id : this.refundOrder.id,
        },
        success: res => {
          this.refundModelShow = false;
        }
      })

    },
    //继续下单该老师
    continue_buy(){
      this.$api.postBase({
        url: 'teacher/refund_read',
        data: {
          id : this.refundOrder.id,
        },
        success: res => {
          this.$xyfun.to('/pages/teacher/detail?id='+this.refundOrder.teacher_id);
        }
      })

    },
    //重新选择老师
    reset_buy(){
      this.$api.postBase({
        url: 'teacher/refund_read',
        data: {
          id : this.refundOrder.id,
        },
        success: res => {
          this.$xyfun.to('/pages/teacher');
        }
      })
    },
  }
}
</script>
<style lang="scss">
.refund-box{
  width: 80%;
  border-radius: 15rpx;
  .refund-tite{
    height: 80rpx;
    line-height: 80rpx;
    font-size: 36rpx;
    text-align: center;
    margin-bottom: 20rpx;
    font-weight: bold;
    position: relative;
    .yz-iconfont{
      position: absolute;
      right: 20rpx;
      top: 0;
      color : #a6a6a6;
    }
  }
  .refund-content{
    padding: 0 20rpx;
    min-height: 200rpx;
    font-size: 26rpx;
  }
  .refund-action{
    padding: 0 20rpx;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    height: 100rpx;
    align-items: center;
    font-size: 24rpx;
    view{
      width: 200rpx;
      height: 60rpx;
      border-radius: 10rpx;
      line-height: 60rpx;
      text-align: center;
    }
    .yes{
      background: $uni-color-primary;
      color: #fff;
    }
    .no{
      background: $uni-color-warning;
      color: #fff;
    }
  }
}
</style>
